<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="./reset.css">
    <link rel="stylesheet" href="./index.css">
</head>
<body>
<!--头部-->
<header>
    <!--    基线对齐：在同一行的内容中，所有内容会自动对齐文本的最下方-->
    <div class="head-content">
        <img class="logo" src="./img/huawei_logo.png" alt="">
        <nav>
            <span>个人及家庭产品</span>
            <span>商用产品及方案</span>
            <span>服务支持</span>
            <span>合作伙伴与开发者</span>
            <span>关于华为</span>
        </nav>
        <div class="search">
            <img class="search-img" src="./img/1.png">
            <img class="search-img" src="./img/2.png">

        </div>
    </div>

</header>


<div class="slideshow">
    <img class="slideshow-img" src="img/3.jpg" alt="轮播图">
</div>
<!--推荐信息-->
<h2>推荐信息</h2>
<div class="red-line"></div>


<!--图片内容盒-->
<div class="img-content">
    <div class="img-box">
        <img class="img1" src="img/4.jpg">
        <img class="img2" src="img/6.jpg">
    </div>

    <div>
        <div class="img-box">
            <img class="img2" src="img/8.jpg">
            <img class="img1 img1-2" src="img/7.jpg">
        </div>
    </div>

    <div>
        <div class="img-box">
            <img class="img4" src="img/9.jpg">
            <img class="img4 img4-2" src="img/10.jpg">
            <img class="img4 img4-3" src="img/13.jpg">
        </div>
    </div>


</div>
<img class="img5" src="img/11.jpg">
<div>

    <!--推荐信息-->
    <h2>新闻与活动</h2>
    <div class="red-line"></div>


    <div class="huodong-content">
<!--        活动块1-->
        <div class="huodong1">
            <img class="img6" src="img/huodong1.jpg">
            <h5>华为全联接大会2023</h5>
            <p class="span-content">本届大会以“加速行业智能化”为主题，邀请思想领袖、商业精英、技术专家、合作伙伴、开发者等业界同仁共同探讨如何加速行业智能化。</p>

        </div>
        <!--        活动块2-->
        <div class="huodong2">
            <img class="img7" src="img/huodong2.jpg">

        </div>

        <!--        活动块3-->
        <div class="huodong3">
            <h4>悟空·画画-科幻与创想“主题AI创作大赛开启</h4>
            <h4>首届ICPC华为挑战赛冠军杯收官，攻克数据库产业难题</h4>
            <h4>华为宣布CANTIAN引擎开源并发布分布式存储全闪新品</h4>
        </div>

    </div>
    <div></div>


</div>


</div>


</body>
</html>